<template>
  <view class="page">
    <view
      class="invite-record"
      @click="
        () => {
          $uni.navigateTo({
            url: '/markingCampaign/pages/recommender/inviteRecord',
          })
        }
      "
    >
      邀请记录
      <image class="icon" src="/static/mine/right-arrow-2.png" mode="widthFix"></image>
    </view>
    <!--	分享海报-->
    <image :src="posterUrl" mode="widthFix" class="image" :show-menu-by-longpress="true"></image>
    <view class="placeholder"></view>
    <!--		分享按钮-->
    <button class="share-btn" open-type="share">邀请好友一起学习</button>
    <popup ref="popup"></popup>
  </view>
</template>

<script>
import shareInfo from "@/utils/shareInfo"
import popup from "@/components/popup/index.vue"
import { dictActionType } from "@/store/modules/dict"
import store from "@/store"
import { getShowImage, getSysParam, handleUrlParams } from "@/utils"
import { getShowNginxPicUrl } from "@/utils/settings"
import { userActionType } from "@/store/modules/user"
let that
export default {
  components: {
    popup,
  },
  data() {
    return {
      posterUrl: "",
    }
  },
  async created() {
    this.posterUrl = getShowNginxPicUrl("52b9ff5598f0cc2c0888d350e0e786c-tic.jpg")
    that = this
  },
  async onShareAppMessage() {
		const userInfo = await store.dispatch(userActionType.action.userInfo)
    let res = await shareInfo.getShareInfoWithoutShareParams({
      imageUrl: getShowNginxPicUrl("0UbQtp0wn7ep7HBxo8Qf.png"),
      title: "呐~我是喊你来上线刷题的！！",
			path: handleUrlParams(
				"/pages/index/index",
				{
					shareType: "邀请有礼",
					shareUserId: userInfo.id,
				}
			)
    })
    //分享之后弹窗
    //过3秒后弹窗
    let res1 = await getSysParam("showPopupAfterShare")
    if (res1 === "是") {
      const popupImageUrl = getShowNginxPicUrl('9c55628426e542b98848939f017f5bf1.jpg')
      setTimeout(() => {
        that.$refs.popup.addPopupItem(popupImageUrl)
      }, 3000)
    }
    return res
  },
}
</script>

<style lang="scss" scoped>
.page {
  min-height: 100vh;
  position: relative;
  .invite-record {
    position: absolute;
    right: 40rpx;
    top: 30rpx;
    background: rgba(0, 0, 0, 0.4);
    border-radius: 34rpx 34rpx 34rpx 34rpx;
    display: flex;
    justify-content: center;
    align-items: center;
    color: white;
    width: 172rpx;
    height: 60rpx;
    font-size: 28rpx;

    .icon {
      margin-left: 8rpx;
      width: 11rpx;
    }
  }
  .image {
    width: 100vw;
  }
  .placeholder {
    height: calc(150rpx + env(safe-area-inset-bottom));
  }
  .share-btn {
    position: fixed;
    bottom: calc(10rpx + env(safe-area-inset-bottom));
    left: 50%;
    width: calc(100vw - 56rpx);
    transform: translateX(-50%);
    height: 88rpx;
    border-radius: 44rpx;
    line-height: 88rpx;
    text-align: center;
    background: #f5be15;
    color: #4e2d00;
    font-size: 32rpx;
    border: 3rpx solid #333333;
  }
}
</style>
